[[Yard]]
<h2>Introduction</h2>
<p>Welcome to an example of Twine Space - Lite!</p>
<p>This story format is designed for use with photospheres (360-degree images) and annotations.</p>
<p>Unlike other story formats, text in passages will be hidden if a photosphere is loaded. This is to prevent issues with larger images overlapping with text on smaller or mobile devices.</p>
<hr>
<h2>Instructions</h2>
<p>In the upper, left-hand corner is the <strong>Navigation Menu</strong>. You can navigate to any area connected to this one. (In technical terms, this means links between passages will appear there.)</p>
<p>If a photosphere is loaded, it will have <em>red spots</em>. Clicking on these will show an annotation.</p>
- photosphere:
name: test
url: ./Yard.PHOTOSPHERE.jpg
- annotation:
title: Shed
text: <p>This shed originally was placed several houses over. It was moved many years ago into this backyard.</p><p>(This annotation is placed -180 x degrees from start.)</p>
position:
x: -180
y: 0
z: 0
- annotation:
title: Sky
text: <p>This is the sky.</p><p>(This annotation is placed +180 degrees y from start.)</p>
position:
x: 0
y: 180
z: 0
- annotation:
title: Front
text: <p>This is the default front of camera.</p><p>(This annotation is placed at 0,0,100.)</p>
position:
x: 0
y: 0
z: 100
- annotation:
title: Back
text: <p>This is the default back of camera.</p><p>(This annotation is placed at 0,0,-100.)</p>
position:
x: 0
y: 0
z: -100
- annotation:
title: Ground
text: <p>This is the ground.</p><p>(This annotation is placed -180 degrees y from start.)</p>
position:
x: 0
y: -180
z: 0
- annotation:
title: <h1>House</h1>
text: This is a house. HTML elements can be freely used for the title (this uses a HTML header element for the title to make the text larger) and internal text like the <strong>See?</strong>.<p>(This annotation is placed +180 x degrees from start.)</p>
position:
x: 180
y: 0
z: 0
- box:
name: Box
position:
x: 0
y: 0
z: 0
---
This text will be hidden!
This is not used.
`);\n });\n\n // Check if the startnode attribute exists.\n if (!this.#storyDataElement[0].hasAttribute('startnode')) {\n // It does not exist, throw an error.\n throw new Error('Error: The startnode attribute cannot be found!');\n }\n\n // Get the startnode attribute.\n const startnode = this.#storyDataElement.attr('startnode');\n\n // Get the startnode value (which is a number).\n const startingPassageID = parseInt(startnode, 10);\n\n // Try to find the starting passage.\n const startingPassageElement = jquery__WEBPACK_IMPORTED_MODULE_0__(`tw-passagedata[pid=\"${startingPassageID}\"]`);\n\n // Was it found?\n if (startingPassageElement.length === 0) {\n // Was not found, throw error.\n throw new Error('Error: Starting passage does not exist!');\n }\n\n // If the 'name' attribute does not exist,\n // show() will be passed undefined\n // and throw an error.\n this.show(startingPassageElement.attr('name'));\n }\n\n /**\n * Replaces current passage shown to reader with rendered source of named passage.\n * If the named passage does not exist, an error is thrown.\n * @function show\n * @param {string} name - name of the passage.\n */\n show (name) {\n // Attempt to find passage.\n const passage = this.getPassageByName(name);\n\n // Does passage exist?\n if (passage === null) {\n // Passage was not found.\n // Throw error.\n throw new Error(`Error: There is no passage with the name \"${name}\"!`);\n }\n\n // Overwrite current tags.\n this.#passageElement.attr('tags', passage.tags);\n\n // Stop the scene.\n window.Director.stop();\n\n // Clear the scene.\n window.Director.clearScene();\n\n // Detect if a \"stage\" (---) is present.\n // parseScene() will return an array of objects and 'text' property.\n const content = (0,_Parse_Scene_index_js__WEBPACK_IMPORTED_MODULE_1__.parse)(passage.source);\n\n console.log('content: ', content);\n\n // Create default, pre-processed text.\n let text = content.text;\n\n // Check if content contains any actor objects.\n if (content.objects.length > 0) {\n // Array of objects containing objects.\n for (const actor of content.objects) {\n // For each object, create an actor.\n for (const props in actor) {\n _ActorFactory_js__WEBPACK_IMPORTED_MODULE_5__[\"default\"].create(props, actor[props]);\n }\n }\n }\n\n // Parse links.\n text = (0,_Parse_Links_js__WEBPACK_IMPORTED_MODULE_2__.parse)(text);\n\n // Parse the Markdown.\n text = (0,_Parse_Markdown_js__WEBPACK_IMPORTED_MODULE_3__.parse)(text);\n\n // Overwrite the parsed with the rendered.\n this.#passageElement.html(text);\n\n /*\n // Update the navigation menu (different per passage!).\n const linkList = $('tw-link');\n\n // Remove previous menu.\n $('md-menu').remove();\n\n // Create new navigation menu.\n const navMenu = $('');\n\n // Go through each twLink.\n linkList.each((twLink) => {\n // Create menu item.\n const menuItem = $(`${twLink.outerHTML}
`);\n // Append menu-item to navMenu.\n navMenu.append(menuItem);\n // Remove original.\n $(twLink).remove();\n });\n\n // Append the navMenu back to the body.\n $(document.body).append(navMenu);\n */\n\n // If there is a click on a tw-link, load the passage!\n jquery__WEBPACK_IMPORTED_MODULE_0__('tw-link[data-passage]').on('click', (e) => {\n // Unload the current meshes.\n window.Director.clearScene();\n // Pull destination passage name from the attribute.\n const passageName = jquery__WEBPACK_IMPORTED_MODULE_0__(e.target).closest('[data-passage]').data('passage');\n // Show the passage by name.\n this.show(passageName);\n });\n }\n\n /**\n * Returns an array of none, one, or many passages matching a specific tag.\n * @function getPassagesByTag\n * @param {string} tag - Tag to search for.\n * @returns {Array} Array containing none, one, or many passage objects.\n */\n getPassagesByTag (tag) {\n // Search internal passages\n return this.#passages.filter((p) => {\n return p.tags.includes(tag);\n });\n }\n\n /**\n * Returns a Passage object by name from internal collection. If none exists, returns null.\n * (The Twine editor prevents multiple passages from having the same name, so\n * this always returns the first search result.)\n * @function getPassageByName\n * @param {string} name - name of the passage.\n * @returns {Passage|null} Passage object or null.\n */\n getPassageByName (name) {\n // Create default value\n let passage = null;\n\n // Search for any passages with the name\n const result = this.#passages.filter((p) => p.name === name);\n\n // Were any found?\n if (result.length !== 0) {\n // Grab the first result.\n passage = result[0];\n }\n\n // Return either null or first result found.\n return passage;\n }\n}\n\n\n//# sourceURL=webpack://twinespace/./src/Story.js?");
/***/ }),
/***/ "./src/index.js":
/*!**********************!*\
!*** ./src/index.js ***!
\**********************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _story_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./story.css */ \"./src/story.css\");\n/* harmony import */ var _material_web_dialog_dialog_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @material/web/dialog/dialog.js */ \"./node_modules/@material/web/dialog/dialog.js\");\n/* harmony import */ var _material_web_button_text_button_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @material/web/button/text-button.js */ \"./node_modules/@material/web/button/text-button.js\");\n/* harmony import */ var _material_web_button_filled_button_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @material/web/button/filled-button.js */ \"./node_modules/@material/web/button/filled-button.js\");\n/* harmony import */ var _material_web_menu_menu_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @material/web/menu/menu.js */ \"./node_modules/@material/web/menu/menu.js\");\n/* harmony import */ var _material_web_menu_menu_item_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @material/web/menu/menu-item.js */ \"./node_modules/@material/web/menu/menu-item.js\");\n/* harmony import */ var jquery__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\n/* harmony import */ var _Story_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Story.js */ \"./src/Story.js\");\n/* harmony import */ var _Director_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Director.js */ \"./src/Director.js\");\n// Import story CSS (used by WebPack)\n\n\n// Importing Materialize CSS\n\n\n// Material Text Button\n\n\n// Material Filled Button\n\n\n// Material Menu\n\n\n// Material Menu Item\n\n\n// Require jQuery\n\n\n// Require Story\n\n\n// Require Director\n\n\n// Create global jQuery\nwindow.$ = jquery__WEBPACK_IMPORTED_MODULE_6__;\n\n// Create Director\nwindow.Director = _Director_js__WEBPACK_IMPORTED_MODULE_8__[\"default\"];\n\n// Create global Story object\nwindow.story = new _Story_js__WEBPACK_IMPORTED_MODULE_7__[\"default\"]();\n\n// Start the story.\nwindow.story.start();\n\n\n//# sourceURL=webpack://twinespace/./src/index.js?");
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module can't be inlined because the eval devtool is used.
/******/ var __webpack_exports__ = __webpack_require__("./src/index.js");
/******/
/******/ })()
;
Apple
Banana
Cucumber